<template>
	<view>
		<view class="vc-item" v-if="hasPassword">
			<text class="vc-item-title">原始密码</text>
			<input type="password" class="vc-item-content" v-model="oldPassword" placeholder="请输入原始密码" maxlength="6" />
		</view>
		<view class="vc-item">
			<text class="vc-item-title">{{ hasPassword ? '新密码' : '密码' }}</text>
			<input type="password" class="vc-item-content" v-model="newPassword" :placeholder="hasPassword ? '新密码' : '密码'" maxlength="6" />
		</view>
		<view class="vc-item" style="border-bottom: unset;">
			<text class="vc-item-title">确认密码</text>
			<input type="password" class="vc-item-content" v-model="newConfirmPassword" placeholder="请输入确认密码" maxlength="6" />
		</view>
		<view class="done-btn bottom-change-view" @click="$noMultipleClicks(saveTransPwd)">保存</view>
	</view>
</template>

<script>
import { isLogin, toLogin, successToShow, errorToShow } from '@/config/common.js';
import { setAccountPassword, changeAccountPassword } from '@/constant/customer.js';
export default {
	data() {
		return {
			hasPassword: '',
			oldPassword: '',
			newPassword: '',
			newConfirmPassword: '',
			passwordInfo: {
				CustomerId: '',
				OldPassword: '',
				NewPassword: ''
			},
			noClick: true
		};
	},
	onLoad(info) {
		if (!isLogin()) {
			toLogin();
		}
		this.passwordInfo.CustomerId = uni.getStorageSync('customerId');
		this.hasPassword = uni.getStorageSync('customer_password');
	},
	methods: {
		async saveTransPwd() {
			if (this.hasPassword) {
				if (this.oldPassword.length != 6) {
					errorToShow('请输入6位数字原始密码');
					return;
				}
				if (this.newPassword.length != 6) {
					errorToShow('请输入6位数字新密码');
					return;
				}
				if (this.newConfirmPassword.length != 6) {
					errorToShow('请输入6位确认数字密码');
					return;
				}
				if (this.newPassword != this.newConfirmPassword) {
					errorToShow('两次密码不一致');
					return;
				}
				this.passwordInfo.OldPassword = this.oldPassword;
				this.passwordInfo.NewPassword = this.newConfirmPassword;
				await changeAccountPassword(this.passwordInfo);
			} else {
				if (this.newPassword.length != 6) {
					errorToShow('请输入6位数字密码');
					return;
				}
				if (this.newConfirmPassword.length != 6) {
					errorToShow('请输入6位确认数字密码');
					return;
				}
				if (this.newPassword != this.newConfirmPassword) {
					errorToShow('两次密码不一致');
					return;
				}
				this.passwordInfo.NewPassword = this.newConfirmPassword;
				await setAccountPassword(this.passwordInfo);
			}
			uni.setStorageSync('customer_password', true);
			successToShow('保存成功', res => {
				uni.navigateBack({
					url: '../info/info'
				});
			});
		}
	}
};
</script>

<style scoped lang="scss">
.vc-item {
	display: flex;
	align-items: center;
	font-size: $main-text-size-32;
	color: $main-text-color-gray-33;
	height: 90rpx;
	background-color: #fff;
	border-bottom: 1px solid $main-line-color-gray-F5;

	&-title {
		margin-right: auto;
		margin-left: 20rpx;
	}

	&-content {
		margin-right: 20rpx;
		width: 500rpx;
		text-align: right;
	}
}

.done-btn {
	height: 80rpx;
	width: 600rpx;
	margin-left: 75rpx;
	background-color: $main-theme-color-green;
	color: #fff;
	font-size: 32rpx;
	position: absolute;
	bottom: 40rpx;
	border-radius: 45rpx;
	display: flex;
	align-items: center;
	justify-content: center;
}

.code-btn {
	background-color: #007aff;
	color: #fff;
	font-size: 30rpx;
	margin-left: auto;
	margin-right: 20rpx;
	border-radius: 10rpx;
	height: 70rpx !important;
	line-height: 70rpx;
}
</style>
